<template>
  <div class="take-order">
    <div class="assign-take-order" v-if="list.length">
      <TakeOrderItem v-for="item in list" :key="item.id" :listItem="item">
        <template v-slot:refuse>
          <el-button type="danger" size="mini" @click="refuseOrder">拒绝订单</el-button>
        </template>
      </TakeOrderItem>
    </div>
    <el-empty description="暂无特邀" v-else style="min-height: 578px;"></el-empty>
  </div>
</template>

<script>
import TakeOrderItem from '@/components/maintainer/TakeOrderItem.vue'
import { AssignTakeOrderService } from '@/api/maintainer'
import { MessageBox } from 'element-ui'
export default {
  data () {
    return {
      list: []
    }
  },
  created () {
    this.takeOrder()
  },

  methods: {
    async takeOrder () {
      const res = await AssignTakeOrderService()
      if (res.status === 1) return
      this.list = res.data
    },
    refuseOrder () {
      MessageBox.confirm('是否拒绝订单？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        // TODO: 拒绝订单
        await MessageBox.alert('已拒绝订单', '提示', {
          confirmButtonText: '确定',
          type: 'success'
        })
      }).catch()
    }
  },

  components: {
    TakeOrderItem
  }
}
</script>

<style lang="less" scoped>
.assign-take-order{
  min-height: 578px;
}
</style>
